<f:view id="ajaxEcho" xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">
	<h:head />
	<h:body>
		<br />
		<p:tab id="pessoa" title="Pessoa">
			<p:panel header="Dados Pessoais">
				<p:growl />
				<h:panelGrid columns="2" columnClasses="label, value">
						<h:outputText value="#{msg['pessoa.nome']}: " />
						<p:inputText value="#{pessoaController.pessoa.nome}" required="true" label="nome" readonly="${readonly}" requiredMessage="O campo nome é Obrigatório."/>
						
						<p:outputLabel for="date" value="#{msg['pessoa.dataNascimento']}: " title="dataNascimento" />
	        			<p:calendar id="date" value="#{pessoaController.pessoa.dataNascimento}"  rendered="${!readonly}" pattern="dd/MM/yyyy" mask="true" >
	        				<f:validator validatorId="dataNascimentoValidator"/>
	        			</p:calendar>
	 					<p:inputMask value="#{pessoaController.pessoa.dataNascimento}" mask="99/99/9999" readonly="${readonly}" rendered="${readonly}">
	 						<f:convertDateTime pattern="dd/MM/yyyy	" />
	 					</p:inputMask>
	
						<h:outputText value="#{msg['pessoa.email']}: " />
						<p:inputText value="#{pessoaController.pessoa.email}" validatorMessage="#{msg['pessoa.dataNascimento']}:" required="true" readonly="${readonly}" requiredMessage="#{msg['validacao.emailObrigatorio']}">
							<f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
						</p:inputText>
				</h:panelGrid>
			
				<p:fileUpload  id="uploadArquivo" value="#{pessoaController.file}" rendered="${!readonly}" mode="simple" skinSimple="true" allowTypes="/(\.|\/)(gif|jpe?g|png)$/">
					<f:validator validatorId="extensaoValidator"/>
				</p:fileUpload>
				
				<h:panelGroup id="downloadFoto" rendered="#{pessoaController.verificaImagem(readonly)}" >
				<h:outputText value="#{msg['usuario.donwload.foto']}: " />
				<p:commandLink style="Margin-top: 10px;" title="Download da Foto" ajax="false" immediate="true">
					<p:graphicImage value="/img/download.png" />
					<p:fileDownload	value="#{pessoaController.imagemPessoa}"  />
				</p:commandLink>  
				</h:panelGroup>


				<h:panelGrid columns="2" columnClasses="label, value">
					<h:panelGroup id="experienciasProfissionais" >
					<div>
					   <p:panel header="#{msg['experiencia.exeperienciasProfissionais']}" style="margin-top: 5%;">
								<p:panel rendered="#{empty pessoaController.pessoa.experienciaProfissionais}">
									<h:outputText value="#{msg['experiencia.naoHaExperiencia']}" />
								</p:panel>
								<ui:repeat  id="experienciaProfissional" var="experienciaProfissional" value="#{pessoaController.pessoa.experienciaProfissionais}">
									<h:outputText value="#{msg['experiencia.empresa']}: " />
									<p:inputText required="true" value="#{experienciaProfissional.empresa}" readonly="${readonly}" /><br/><br/>
									
									<h:outputText value="#{msg['experiencia.atividade']}: " /><br/>

									<p:inputTextarea rows="6" cols="33" required="true" value="#{experienciaProfissional.atividade}" readonly="${readonly}" /> <br/><br/>
									<p:commandButton id="excluir" value="#{msg['experiencia.excluirExperiencia']}" action="#{pessoaController.excluirExperiencia(experienciaProfissional)}"  ajax="false" update="experienciasProfissionais"  rendered="#{!readonly}" immediate="true" process="@this" icon="ui-icon-trash"/><br/>
									<br/>
									<p:separator rendered="#{not empty pessoaController.pessoa.experienciaProfissionais and pessoaController.pessoa.experienciaProfissionais.size() >1}"/>
									<br/>
								</ui:repeat>
								<h:outputText rendered="#{not empty pessoaController.pessoa.experienciaProfissionais}" value="Total de Experiências: #{pessoaController.pessoa.experienciaProfissionais.size()}" style="font-weight: bold;"/>
							
						</p:panel>
						
						
						<br/>
						<p:commandButton  value="#{msg['experiencia.adicionarExperiencia']}" actionListener="#{pessoaController.pessoa.adicionarNovaExperienciaProfissional()}" process="experienciasProfissionais" update="experienciasProfissionais" rendered="#{!readonly}" icon="ui-icon-plus"/>
					</div>
					</h:panelGroup>
				</h:panelGrid>
			</p:panel>
		</p:tab>
	</h:body>
</f:view>